<template>
  <div id="bd">
      <div class="bd_hader">
        <div class="bd_hader2">
            <router-link :to="{
            name:'Home'
            }">
            <img src="../assets/zuo.png" alt="">
            </router-link>
        </div>
        <div class="bd_hader3">
            <span>排行榜</span>
        </div>
      </div>
      <div class="fen">
        <ul>
          <li>
            <router-link :to="{
            name:'bd_ydb'
            }">
            <span>阅读榜</span>
            </router-link>
          </li>
          <li>
            <router-link :to="{
            name:'bd_xzb'
            }">
            <span>新作榜</span>
            </router-link>
          </li>
          <li>
            <router-link :to="{
            name:'bd_zhb'
            }">
            <span>综合榜</span>
            </router-link>
          </li>
        </ul>
      </div>
  </div>
</template>

<script>
export default {

}
</script>

<style>
.bd_hader{
    height: 2.345625rem /* 37.53/16 */;
    /* background-color: pink; */
    background-color: #fff;
}
.bd_hader2{
    width: 2.3125rem /* 37/16 */;
    height: 2.3125rem /* 37/16 */;
    /* border: 1px solid black; */
    float: left;
}
.bd_hader2 img{
    width: 2.75rem;
    height: 2.75rem;
    margin: -.1875rem /* 3/16 */ -.1875rem /* 3/16 */;
}
.bd_hader3{
    width: 3.3125rem /* 37/16 */;
    height: 2.3125rem /* 37/16 */;
    /* border: 1px solid black; */
    float: left;
    margin-left: 8.125rem /* 130/16 */;
    text-align: center;
    line-height: 2.1875rem /* 35/16 */;
}
.bd_hader3 span{
  color: #333;
}
.fen ul{
  width: 100%;
  height: 2.345625rem /* 37.53/16 */;
  /* background-color: pink; */
  background-color: #fff;
  border-bottom: 1px solid #efefef;
}
.fen ul li{
  width: 7.8125rem /* 125/16 */;
  height: 2.375rem /* 38/16 */;
  /* border: .0625rem 1/16 solid black; */
  float: left;
  text-align: center;
  line-height: 2.5rem /* 40/16 */;
}
.fen ul li span{
  /* color: #b3b3b3; */
  font-size: .875rem;
}
</style>